@import "common.scss";
.s-header{
height:70px;
background-color:#fff;
.header{
    @include typeArea();
    height: 100%;
    overflow: hidden;
    .header-l{
        height: 100%;
        width: 409px;
        overflow: hidden;
        float: left;
        .header-logo{
            height: 100%;
            padding-right: 20px;
            float: left;
            
        }
        .split{
            background: #DADADA;
            display: inline-block;
            height: 20px;
            width: 1px;
            margin-top: 24px;
        }
        .header-slogan{
            float: right;
        }
        img{
            height: 70px;
            display: block;
            vertical-align: middle;
        }
    }
    .header-r{
        float: right;
        margin-top: 27px;
        .nav{
            width: 264px;
            .nav-item{
                float: left;
                margin-left: 25px;
                a{
                    font-size: 14px;
                    color: #333;
                }
            }
        }
    }
}
}
.s-main{  
    width: 100%;
    height: 640px;
    background-color: #7092CF;
    position: relative;
    .main-bg{
        width: 100%;
        height: 640px;
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1;
        img{
             width: 100%;
             height: 640px;
         }
    }
    .main-wrap{
        @include typeArea();
        position: relative;
        z-index: 2;

        .main-content{
            width: 372px;
            height: 372px;
            background:#fff;
            position: absolute;
            right: 0;
            top: 65px;
           
            .content-wrap{
                width: 372px;
                padding-left:25px;
                padding-right:25px;
            }
            .zc-hd{
                padding-top: 35px;
                height: 60px;
                font-weight: 400;
                text-align: center;
                a{
                    color:#333;
                    font-size: 18px;
                    border-bottom: 2px solid #00c89f;;
                }
            }
            .zc-middle{
                padding-top: 30px;
                width: 322px;
                position: relative;
                .dlTips{
                    font-size: 12px;
                        color:#f36903;
                        line-height: 1;
                        padding-top: 4px;
                        position: absolute;
                        top: 76%;
                        left: 0;
                }
                .phone-wrap,.pwd-wrap{
                    width: 322px;
                    height: 40px;
                    color: #ccc;
                    font-size: 14px;
                    padding-top: 4px;
                    // padding-left: 10px;
                    border:1px solid #ccc;
                    box-sizing: border-box;
                    display: flex;
                    align-items: center;
                    // justify-content: space-between;
                    margin-bottom:30px;
                    .phone-img,.pwd-wrap{                      
                        width: 40px;
                        line-height: 40px;
                        text-align: center;
                    }
                    .phone-input,.pwd-wrap{
                        // float: right;
                        width: 278px;
                        outline: 0;
                        border: 0;
                        background: transparent;
                        
                    }
                }
                .pwd-wrap,.icon-icon-mima{
                   padding-left: 6px;
                   padding-right: 14px;
                }
                .pwd-wrap{
                    margin-bottom: 15px;
                }
                .p-content{
                    font-size: 14px;
                    margin-bottom: 25px;
                    a{
                        color: #6f6f6f;
                    }
                }
                .zc{
                    width: 322px;
                    height: 40px;
                    line-height: 40px;
                    background-color:#00c89f;
                    text-align: center;
                    margin-bottom: 30px;
                    .zc-button{
                        font-size: 18px;
                        color: #fff;
                    }
                }
            }
            
            
        }
        .zc-ft{
            width: 372px;
            height: 64px;
            background-color: #f7f8f8;
            padding: 0 32px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .zf-l{
                width: 120px;
                line-height: 64px;
                span{
                    font-size: 24px;
                    color: #9fa5a9;
                    padding: 5px;
                }
            }
            a{
                color: #00c89f;
                font-size: 14px;
                cursor: pointer;
            }
        }
    }
}
.s-footer{
    width: 100%;
    height: 128px;
    background-color:#fff;
    .footer{
        @include typeArea();
        height: 100%;
        text-align: center;
        padding-top:45px;
        .p1{
            color: #666;
            font-size: 12px;
            margin: 0 auto;
            line-height: 5px;
        }
        .p2{
            color: #999;
            font-size: 12px;
            margin: 0 auto;
        }
    }
}